import { valid } from 'mockjs';
import { Input } from 'postcss';
import React, { useState, useEffect } from 'react'
import { ProductCard, Tag, Button } from 'react-vant';
import My_empty from '../../components/My_empty';
function Shop() {
  const [data, setData] = useState(JSON.parse(window.localStorage.getItem("shop")) || [])
  const [flag,setFlag]=useState(false)
  // useEffect(()=>{
  //   setData(shop)
  // },[shop])
  //加加
  const add_num_data = (val) => {
    let newData = [...data];
    newData.forEach(item => {
      if (item.id == val.id) {
        item.num++
      }
    })
    setData(newData)
  }
  //减减
  const del_num_data = (val) => {
    setFlag=(false)
    let newData = [...data];
    newData.forEach(item => {
      if (item.id == val.id) {
        item.num--
      }
    })
    window.localStorage.setItem("shop",JSON.stringify(newData))
    setData(newData)
  }
  //单选
  const check_item=(val)=>{
    console.log(val);
    let newData=[...data];
    newData.forEach(item=>{
      item.checked=!item.checked
    })
    window.localStorage.setItem("shop",JSON.stringify(newData))
    setData(newData)
  }
  //全选
  const set_All_checkbox=(e)=>{
    set_All_checked(e.target.checked);
    let newData=[...data];
    newData.forEach(item=>{
      item.checked=!item.checked
    })
    window.localStorage.setItem("shop",JSON.stringify(newData))
    setData(newData)
  }
  //总价
  const set_price=()=>{
    let num=0;
    let newData=[...data];
    newData.forEach((item=>{
      num+=item.price*item.num
    }))
    set_num(num)
  }
  return (
    <div>
       <input type="checkbox" checked={true} />
      {
        data && data.length > 0 ? data.map((item, index) => {
          return <ProductCard
            num={item.num}
            price={item.price}
            desc="描述信息"
            title={item.title}
            
            thumb={item.img}
           

            tags={
             
              <>
              
                <Tag plain type="danger" style={{ marginRight: 5 }}>
                  标签
                </Tag>
                <Tag plain type="danger">
                  标签
                </Tag>
              </>
            }
            footer={
              <>
                <Button disabled={flag} size="mini" round plain style={{ marginRight: 2 }} onClick={() =>item.num>1?del_num_data(item):setFlag}>
                  标签1
                </Button>
                <Button size="mini" round plain onClick={() => add_num_data(item)}>
                  标签2
                </Button>
              </>
            }
          />

        }) : <My_empty title={"没有购物车数据"}></My_empty>
      }
    </div>
  )
}

export default Shop